<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>jQuery中filter方法</title>
    <script src="js/jquery-1.11.3.min.js"></script>
    <style type="text/css" media="screen">
    body {
        width: 960px;
        margin: 0 auto;
        font: 18px/1.8em '微软雅黑';
    }

    h1 {
        color: green;
    }
    .info {
    	background-color: yellow;
    }
    </style>
    <script>
    jQuery(document).ready(function() {
        // 选择指定列
    	$('td:nth-child(5n+3)')
        // 将函数作为参数传给filter方法
        .filter(function() {
            console.log($(this).text());
    		if($(this).text() < 21) {
                return true;
            } else {
                return false;
            }
    	}).addClass('info');
    });
    </script>
</head>

<body>
    <h1>jQuery中的filter方法</h1>

    <table>
        <tr>
            <th>序号</th>
            <th>姓名</th>
            <th>年龄</th>
            <th>性别</th>
            <th>专业</th>
        </tr>
        <tr>
            <td>1</td>
            <td>小明</td>
            <td>21</td>
            <td>男</td>
            <td>新闻</td>
        </tr>
        <tr>
            <td>2</td>
            <td>小冷</td>
            <td>20</td>
            <td>女</td>
            <td>广告</td>
        </tr>
        <tr>
            <td>3</td>
            <td>小宝</td>
            <td>22</td>
            <td>女</td>
            <td>数学</td>
        </tr>
        <tr>
            <td>4</td>
            <td>老盖</td>
            <td>24</td>
            <td>男</td>
            <td>软件工程	</td>
        </tr>
    </table>
</body>

</html>
